<template>
	<view>
		<uni-nav-bar :title="$t('personal.text15')" :fixed="true" :border="false" color="var(--theme-text-color)" backgroundColor="var(--theme-color)"></uni-nav-bar>
		<view class="icon-xl circle flex-center back-btn" style="position: fixed;top: 5px;left: 16px;z-index: 100;" @click="backPage">
			<uni-icons type="arrow-left" size="24" color="#fff"></uni-icons>
		</view>
		<view class="content p-lr-16 mt50 flex-column">
			<image src="/static/personal/account-bg.png" style="width: 226px; height: 184px;" mode=""></image>
			<view class="mt50" style="width: 100%;">
				<text class="text-des-color">{{$t('selectAccount')}}</text>
				<view class="mt10 p10 type" v-for="(item,index) in list" :key="index" :style="{'background': `url(&quot;/static/personal/${item.bgImg}.png&quot;) 0% 0% / contain no-repeat`,'height': '64px','box-sizing': 'border-box'}">
					<navigator :url="`/pages/personal/withdraw-account/detail?type=${item.value}`">
						<view class="flex-between">
							<view style="display: flex;flex-direction: column;">
								<image :src="`/static/personal/${item.icon}.png`" style="width: 16px; height: 16px;" mode=""></image>
								<text>{{item.lable}}</text>
							</view>
							<uni-icons type="right" color="#fff" size="16"></uni-icons>
						</view>
					</navigator>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { ref } from 'vue';
	import useGlobalProperties from '/utils/useGlobalProperties.js'
	const { $t,$i18n } = useGlobalProperties()
	const backPage = () =>{
		// 返回上一页
		// uni.navigateBack({
		//   delta: 1 // 默认值为1，表示返回上一页
		// });
		history.back()
	}
	const list = [
		{ lable:$t('bankCard'), bgImg:'bank-bg', icon:'bank', value: 1 },
		{ lable:'USD-TRC20', bgImg:'trc-bg',icon:'usdt', value: 2 },
		{ lable:'USD-ERC20', bgImg:'erc-bg',icon:'usdt', value: 3 },
	]
</script>

<style scoped>
.type {
    color: var(--theme-text-color) !important;
}
</style>
